<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Page Title | TailGrids</title>
    <link
      rel="shortcut icon"
      href="../../assets/images/favicon.svg"
      type="image/x-icon"
    />
    <link rel="stylesheet" href="../../assets/css/tailwind.css" />
  </head>
  <body>
    <!-- ====== Page Title Section Start -->
    <section class="bg-white py-[70px] dark:bg-dark">
      <div class="mx-auto px-4 sm:container">
        <div
          class="flex items-center border-b border-stroke pb-6 dark:border-dark-3"
        >
          <div
            class="mr-[18px] h-[44px] w-full max-w-[44px] overflow-hidden rounded-xl"
          >
            <img
              src="../images/page-title/image.png"
              alt="page title"
              class="h-full w-full object-cover object-center"
            />
          </div>
          <div>
            <h4 class="mb-1 text-sm font-semibold text-dark dark:text-white">
              Hey Devid Wisedom 👋
            </h4>
            <p class="text-sm font-medium text-body-color dark:text-dark-6">
              Lorem ipsum dolor sit amet, consectetur adipiscing elit ante.
            </p>
          </div>
        </div>
      </div>
    </section>
    <!-- ====== Page Title Section End -->
  </body>
</html>
